<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"
        integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.css">

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"
        integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"
        integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous">
    </script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.js"></script>
    <title>Login</title>
</head>

<body>

</body>
<script type="text/javascript">
	var basePath = "/itsu-token";
    $.confirm({
        title: 'Login',
        content: '' +
            '<form action="" class="formName">' +
            '<div class="form-group">' +
            '<label>User</label>' +
            '<input type="text" placeholder="User" id="user" class="form-control" required />' +
            '</div>' +
            '<div class="form-group">' +
            '<label>Password</label>' +
            '<input type="password" placeholder="Password" id="pwd" class="form-control" required />' +
            '</div>' +
            '</form>',
        buttons: {
            formSubmit: {
                text: 'Submit',
                btnClass: 'btn-blue',
                action: function () {
                    var user = this.$content.find('#user').val();
                    if (!user) {
                        $.alert('User can not input a empty value');
                        return false;
                    }
                    var pwd = this.$content.find('#pwd').val();;
                    if (!pwd) {
                        $.alert('Password can not input a empty value');
                        return false;
                    }

                    $.ajax({
                        type: "post",
                        url: basePath + "/tokenLogin",
                        data: {
                            user: user,
                            password: pwd
                        },
                        success: function (res) {
                        	if(res.indexOf("/") != 0){
								res = basePath + "/" + res;                        		
                        	} else {
                        		res = basePath + res;
                        	}
                            top.location.href = res;
                        },
                        error: function (error) {
                            $("body").addClass("text-center").html("<h1>" + error.status +
                                "</h1> <hr> <h4>" + error
                                .responseText + "</h4>");
                        }
                    });
                }
            },
            cancel: function () {
                //close
            },
        },
        onContentReady: function () {
            // bind to events
            var jc = this;
            this.$content.find('form').on('submit', function (e) {
                // if the user submits the form by pressing enter in the field.
                e.preventDefault();
                jc.$formSubmit.trigger('click'); // reference the button and click it
            });
        }
    });
</script>

</html>